<template>
  <div
    ref="main"
    class="page-fs"
  />
</template>

<script setup>
import {onMounted, ref, unref} from "vue";
import UtilEcharts from "./UtilEcharts";

const props = defineProps({
  opt: {
    type: Object,
    required: true
  }
})

const main = ref()

let opt = {
  title: {
    text: 'ECharts 入门示例'
  },
  tooltip: {},
  xAxis: {
    data: ['衬衫', '羊毛衫', '雪纺衫', '裤子', '高跟鞋', '袜子']
  },
  yAxis: {},
  series: [
    {
      name: '销量',
      type: 'bar',
      data: [5, 20, 36, 10, 10, 20]
    }
  ]
}

onMounted(() => {
  console.log(props.opt)
  UtilEcharts.init(unref(main), props.opt || opt)
})
</script>

<style scoped>

</style>